Commit 4b0a841f authored by Alain Takoudjou's avatar Alain Takoudjou

Adding Software file management into webrunner

parent 67a1d495
...@@ -45,7 +45,7 @@ def gitStatus(config, project): ...@@ -45,7 +45,7 @@ def gitStatus(config, project):
try: try:
repo = Repo(project) repo = Repo(project)
git = repo.git git = repo.git
json = git.status() json = git.status().replace('#', '')
branch = git.branch().replace(' ', '').split('\n') branch = git.branch().replace(' ', '').split('\n')
isdirty = repo.is_dirty(untracked_files=True) isdirty = repo.is_dirty(untracked_files=True)
code = 1 code = 1
......
...@@ -81,9 +81,21 @@ body { ...@@ -81,9 +81,21 @@ body {
padding-top: 3px; padding-top: 3px;
float: left; float: left;
width: 700px; width: 700px;
height: 22px;
text-align: center; text-align: center;
color: #4c6172; color: #4c6172;
text-shadow: 0 1px 1px #fff; text-shadow: 0 1px 1px #fff;
overflow: hidden;
}
#header .line{
width:1px;
border-left: 1px solid #678DAD;
background: #CAD4DC;
height: 24px;
float: left;
margin-top: 2px;
margin-right: 5px;
margin-left:5px
} }
#editor { #editor {
...@@ -163,7 +175,6 @@ body { ...@@ -163,7 +175,6 @@ body {
#main #main
{ {
background: url(../images/main_bg_all.png) repeat-y; background: url(../images/main_bg_all.png) repeat-y;
padding:10px;
padding-left: 28px; padding-left: 28px;
padding-right: 25px; padding-right: 25px;
min-height: 400px; min-height: 400px;
...@@ -217,26 +228,30 @@ body { ...@@ -217,26 +228,30 @@ body {
} }
.button { .button {
padding: 5px 10px; padding: 5px 10px;
display: inline; display: inline;
background: #eee; background: #eee;
border: none; border: none;
color: #000; color: #000;
cursor: pointer; cursor: pointer;
font-weight: bold; font-weight: bold;
border:1px solid #000; border:1px solid #000;
margin-top:10px; margin-top:10px;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
} }
.button:hover { .button:hover {
background-position: 0 center; background-position: 0 center;
background: #666666; background: #666666;
color: #fff; color: #fff;
box-shadow: 1px 1px 1px #888888;
} }
.button:active { .button:active {
background-position: 0 top; background-position: 0 top;
position: relative; position: relative;
top: 1px; top: 1px;
padding: 6px 10px 4px; padding: 6px 10px 4px;
box-shadow: 1px 1px 1px #888888;
} }
.focusField{ .focusField{
...@@ -255,11 +270,11 @@ body { ...@@ -255,11 +270,11 @@ body {
} }
.flash{ .flash{
margin-left:20px; margin-left:20px;
color:#FF5500; color:#4A131F;
font-style:italic; font-style:italic;
font-size:14px; font-size:14px;
position:relative; position:relative;
} }
.flashes{ .flashes{
...@@ -273,15 +288,21 @@ body { ...@@ -273,15 +288,21 @@ body {
.clear{ .clear{
clear: both; clear: both;
height:1px;
}
.home_content{
padding: 15px;
} }
#home_box{ #home_box{
background: none; background: none;
margin: 15px;
border: 1px solid #678dad; border: 1px solid #678dad;
padding: 0; padding: 0;
height: 405px; height: 405px;
color: #4c6172; color: #4c6172;
margin: 15px;
} }
#home_box a{ #home_box a{
...@@ -324,6 +345,7 @@ body { ...@@ -324,6 +345,7 @@ body {
font-size: 13px; font-size: 13px;
float: left; float: left;
width: 400px; width: 400px;
cursor:default;
} }
...@@ -370,6 +392,7 @@ body { ...@@ -370,6 +392,7 @@ body {
font-size: 13px; font-size: 13px;
float: left; float: left;
width: 150px; width: 150px;
cursor:default;
} }
.file_tree { .file_tree {
...@@ -381,6 +404,24 @@ body { ...@@ -381,6 +404,24 @@ body {
padding: 5px; padding: 5px;
} }
.file_tree_short{
width: 352px;
height: 100px;
border: solid 1px #678dad;
background: #fff;
overflow: auto;
padding: 5px;
float:left;
}
.box_software{
width: 382px;
height: 100px;
background: #fff;
padding: 5px;
float:right;
}
#contentInfo{ #contentInfo{
width: 752px; width: 752px;
border: solid 1px #678dad; border: solid 1px #678dad;
...@@ -415,16 +456,22 @@ body { ...@@ -415,16 +456,22 @@ body {
.file_info{ .file_info{
margin-top:10px; margin-top:10px;
background: #96b9d7; background: #e4e4e4;
color: #000; padding: 5px 10px 5px;
padding: 4px; box-shadow: 1px 1px 1px #888888;
font-size: 16px; -webkit-border-radius: 3px;
padding-left: 20px; -moz-border-radius: 3px;
color: #737373;
font-weight: bold;
text-shadow: 0px 1px #FFF;
margin-bottom: 9px;
font-size: 14px;
cursor:default;
} }
#check{ #check{
margin-right:5px; margin-right:5px;
margin-top:4px; margin-top:2px;
display: none; display: none;
float: left; float: left;
} }
...@@ -451,7 +498,8 @@ body { ...@@ -451,7 +498,8 @@ body {
select { select {
-webkit-appearance: button; -webkit-appearance: button;
-webkit-border-radius: 2px; -webkit-border-radius: 2px;
-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1); -moz-border-radius: 2px;
box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.1);
-webkit-padding-end: 20px; -webkit-padding-end: 20px;
-webkit-padding-start: 2px; -webkit-padding-start: 2px;
-webkit-user-select: none; -webkit-user-select: none;
......
...@@ -24,7 +24,7 @@ $(document).ready( function() { ...@@ -24,7 +24,7 @@ $(document).ready( function() {
$.ajax({ $.ajax({
type: "POST", type: "POST",
url: $SCRIPT_ROOT + '/createSoftware', url: $SCRIPT_ROOT + '/createSoftware',
data: "folder=" + workdir + $("input#subfolder").val() + $("input#software").val(), data: "folder=" + $("input#subfolder").val() + $("input#software").val(),
success: function(data){ success: function(data){
if(data.code == 1){ if(data.code == 1){
location.href = $SCRIPT_ROOT + '/editSoftwareProfile' location.href = $SCRIPT_ROOT + '/editSoftwareProfile'
...@@ -64,8 +64,8 @@ $(document).ready( function() { ...@@ -64,8 +64,8 @@ $(document).ready( function() {
function selectFile(file){ function selectFile(file){
relativeFile = file.replace(workdir, ""); relativeFile = file.replace(workdir, "");
$("#info").empty(); $("#info").empty();
$("#info").append("Selection: " + file); $("#info").append("Selection: " + relativeFile);
$("input#subfolder").val(relativeFile); $("input#subfolder").val(file);
path = ""; path = "";
if(method == "open"){ if(method == "open"){
checkFolder(file); checkFolder(file);
......
...@@ -48,7 +48,7 @@ $(document).ready( function() { ...@@ -48,7 +48,7 @@ $(document).ready( function() {
if(data.code == 1){ if(data.code == 1){
$("#branchlist").show(); $("#branchlist").show();
$("#status").append("<h2>Your Repository status</h2>"); $("#status").append("<h2>Your Repository status</h2>");
message = data.result.split('#').join('<br/>'); message = data.result.split('\n').join('<br/>');
//alert(message); //alert(message);
$("#status").append("<p>" + message + "</p>"); $("#status").append("<p>" + message + "</p>");
loadBranch(data.branch); loadBranch(data.branch);
......
$(document).ready( function() {
var editor = ace.edit("editor");
editor.setTheme("ace/theme/crimson_editor");
var CurentMode = require("ace/mode/text").Mode;
editor.getSession().setMode(new CurentMode());
editor.getSession().setTabSize(2);
editor.getSession().setUseSoftTabs(true);
editor.renderer.setHScrollBarAlwaysVisible(false);
var script = "/readFolder";
var Mode = function(name, desc, clazz, extensions) {
this.name = name;
this.desc = desc;
this.clazz = clazz;
this.mode = new clazz();
this.mode.name = name;
this.extRe = new RegExp("^.*\\.(" + extensions.join("|") + ")$");
};
var modes = [
new Mode("php", "PHP",require("ace/mode/php").Mode, ["php", "in", "inc"]),
new Mode("python", "Python", require("ace/mode/python").Mode, ["py"]),
new Mode("buildout", "Python Buildout config", require("ace/mode/buildout").Mode, ["cfg"])
];
var projectDir = $("input#project").val();
var send = false;
var edit = false;
var workdir = $("input#workdir").val();
$('#fileTree').fileTree({ root: projectDir, script: $SCRIPT_ROOT + script, folderEvent: 'click', expandSpeed: 750, collapseSpeed: 750, multiFolder: false, selectFolder: true }, function(file) {
selectFile(file);
});
$("#add").click(function(){
var path = $("input#project").val();
if (send) return false;
if($("input#file").val() == "" ||
$("input#file").val() == "Enter name here..."){
error("Error: Please enter your file or folder name");
return false;
}
if($("input#subfolder").val() != ""){
path = $("input#subfolder").val();
}
path = path + "/" + $("input#file").val();
send = true;
$.ajax({
type: "POST",
url: $SCRIPT_ROOT + '/createFile',
data: "file=" + path + "&type=" + $("#type").val(),
success: function(data){
if(data.code == 1){
$('#fileTree').fileTree({ root: projectDir, script: $SCRIPT_ROOT + script, folderEvent: 'click', expandSpeed: 750, collapseSpeed: 750, multiFolder: false, selectFolder: true }, function(file) {
selectFile(file);
});
$("input#file").val("");
$("#flash").fadeOut('normal');
$("#flash").empty();
$("#info").empty();
$("#info").append("Please select your file or folder into the box...");
$("input#subfolder").val("");
}
else{
error(data.result);
}
send = false;
}
});
return false;
});
$("#save").click(function(){
if(!edit){
error("Please select the file to edit");
return false;
}
send = false;
$.ajax({
type: "POST",
url: $SCRIPT_ROOT + '/saveFileContent',
data: "file=" + $("input#subfolder").val() + "&content=" + editor.getSession().getValue(),
success: function(data){
if(data.code == 1){
$("#flash").fadeOut('normal');
$("#flash").empty();
}
else{
error(data.result);
}
send = false;
}
});
return false;
});
function error(msg){
$("#flash").fadeOut('normal');
$("#flash").empty();
$("#flash").fadeIn('normal');
$("#flash").append("<ul class='flashes'><li>" + msg + "</li></ul>");
}
function selectFile(file){
relativeFile = file.replace(projectDir, "");
$("#info").empty();
$("#info").append(relativeFile);
$("input#subfolder").val(file);
path = "";
send = false;
edit = false;
if(file.substr(-1) != "/"){
$.ajax({
type: "POST",
url: $SCRIPT_ROOT + '/getFileContent',
data: "file=" + file,
success: function(data){
if(data.code == 1){
$("#flash").fadeOut('normal');
$("#flash").empty();
$("#edit_info").empty();
var name = file.split('/');
$("#edit_info").append("Edit selected file (" +
name[name.length - 1] + ")");
editor.getSession().setValue(data.result);
setEditMode(name[name.length - 1]);
edit = true;
}
else{
error(data.result);
}
send = false;
}
});
}
else{
$("#edit_info").empty();
$("#edit_info").append("Edit your selected file");
editor.getSession().setValue("");
}
return;
}
function setEditMode(file){
var CurentMode = require("ace/mode/text").Mode;
editor.getSession().setMode(new CurentMode());
for (var i=0; i< modes.length; i++){
if(modes[i].extRe.test(file)){
editor.getSession().setMode(modes[i].mode);
set = true;
break;
}
}
}
});
\ No newline at end of file
{% extends "layout.html" %} {% extends "layout.html" %}
{% block title %}SlapOs buildout web based runner {% endblock %} {% block title %}SlapOs buildout web based runner {% endblock %}
{% block body %} {% block body %}
<div id="home_box">
<div class="inner_box"> <div class="inner_box">
<div class="lmenu"> <div class="lmenu">
<h2><a href="{{ url_for('configRepo')}}">Create a new Project from your repository</a></h2> <h2><a href="{{ url_for('configRepo')}}">Create a new Project from your repository</a></h2>
<p>Choose your online repository, SlapOS runner is web based development tool which uses slapgrid to install and instantiate the software.</p> <p>Your repository will be cloned into your project folder, you will need the url of the repository.
This allow you to open and edit your local project copy and synchonize content with online repository.
</p>
<img src="{{ url_for('static', filename='images/folder_html.png') }}" /> <img src="{{ url_for('static', filename='images/folder_html.png') }}" />
<div class="clear"></div> <div class="clear"></div>
</div> </div>
<div class="smenu"> <div class="smenu">
<h2><a href="{{ url_for('openProject', method='open')}}">Open Existing Project</a></h2> <h2><a href="{{ url_for('openProject', method='open')}}">Open Existing Project</a></h2>
<p>Choose your online repository, SlapOS runner is web based develop.</p> <p>Once you have cloned your repository, you can open project here.</p>
<img src="{{ url_for('static', filename='images/mydocuments.png') }}" /> <img src="{{ url_for('static', filename='images/mydocuments.png') }}" />
<div class="clear"></div> <div class="clear"></div>
</div> </div>
<div class="sright_menu"> <div class="sright_menu">
<h2><a href="{{ url_for('manageProject')}}">Manage your Project</a></h2> <h2><a href="{{ url_for('manageProject')}}">Manage your Project</a></h2>
<p>Choose your online repository, SlapOS runner is web based develop.</p> <p>You can view details of your project and commit content here.</p>
<img src="{{ url_for('static', filename='images/manage_repo.png') }}" /> <img src="{{ url_for('static', filename='images/manage_repo.png') }}" />
</div> </div>
<div class="clear"></div> <div class="clear"></div>
<div class="lmenu"> <div class="lmenu">
<h2><a href="{{ url_for('openProject', method='new')}}">Start with a new software release now</a></h2> <h2><a href="{{ url_for('openProject', method='new')}}">Start a new software release</a></h2>
<p>Choose your online repository, SlapOS runner is web based development tool which uses slapgrid to install and instantiate the software.</p> <p>Create a new software into your selected project directory. This allow you to create, edit and run a new software on SlapOs, using webrunner tools.
</p>
<img src="{{ url_for('static', filename='images/folder_blue.png') }}" /> <img src="{{ url_for('static', filename='images/folder_blue.png') }}" />
<div class="clear"></div> <div class="clear"></div>
</div> </div>
</div> </div>
</div>
{% endblock %} {% endblock %}
...@@ -17,7 +17,7 @@ ...@@ -17,7 +17,7 @@
{% if request.path == '/editSoftwareProfile' or request.path == '/editInstanceProfile' %} {% if request.path == '/editSoftwareProfile' or request.path == '/editInstanceProfile' %}
<script src="{{ url_for('static', filename='ace/ace-uncompressed.js') }}" type="text/javascript" charset="utf-8"></script> <script src="{{ url_for('static', filename='ace/ace-uncompressed.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='ace/theme-crimson_editor.js') }}" type="text/javascript" charset="utf-8"></script> <script src="{{ url_for('static', filename='ace/theme-crimson_editor.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='ace/mode-buildout.js') }}" type="text/javascript" charset="utf-8"></script> <script src="{{ url_for('static', filename='ace/mode-buildout.js') }}" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript"> <script type="text/javascript">
$(document).ready(function() { $(document).ready(function() {
...@@ -67,7 +67,9 @@ ...@@ -67,7 +67,9 @@
</div> </div>
<div id="header"> <div id="header">
<div class="block_header"> <div class="block_header">
<a href="{{ url_for('home') }}" style="float:left"><img alt="" src="{{ url_for('static', filename='images/home.png') }}" /></a> <a href="{{ url_for('home') }}" style="float:left;" title="Home"><img alt="" src="{{ url_for('static', filename='images/home.png') }}" /></a>
<div class="line"></div>
<a href="{{ url_for('curentSoftware') }}" style="float:left" title="Current Software Folder"><img alt="" src="{{ url_for('static', filename='images/project.png') }}" /></a>
<h2 class="info">{% block title %}{% endblock %} - {{session.title}}</h2> <h2 class="info">{% block title %}{% endblock %} - {{session.title}}</h2>
</div> </div>
<div class="wmenu"> <div class="wmenu">
...@@ -102,7 +104,7 @@ ...@@ -102,7 +104,7 @@
{% endif %} {% endif %}
{% endwith %} {% endwith %}
</div> </div>
<div {% if request.path == '/' %} id="home_box" {%else%} id="content" {% endif %}> <div {% if request.path == '/' %} class="home_content" {%else%} id="content" {% endif %}>
{% if request.path != '/' %} {% if request.path != '/' %}
<div class="main_head"> <div class="main_head">
</div> </div>
......
{% extends "layout.html" %} {% extends "layout.html" %}
{% block title %}Manage your Project folder{% endblock %} {% block title %}Manage your Project folder{% endblock %}
{% block head %} {% block head %}
{{ super() }} {{ super() }}
<link href="{{ url_for('static', filename='css/jqueryFileTree.css', _external=False) }}" rel="stylesheet" type="text/css" media="screen" />
<script src="{{ url_for('static', filename='jquery/jqueryFileTree.js') }}" type="text/javascript" charset="utf-8"></script> <script src="{{ url_for('static', filename='jquery/jqueryFileTree.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='scripts/repo.js') }}" type="text/javascript" charset="utf-8"></script> <script src="{{ url_for('static', filename='scripts/repo.js') }}" type="text/javascript" charset="utf-8"></script>
{% endblock %} {% endblock %}
{% block body %} {% block body %}
<form action="{{ url_for('updateInstanceProfile') }}" method=post> <form action="" method=post>
<input type="hidden" name="workdir" id="workdir" value="{{workDir}}" /> <input type="hidden" name="workdir" id="workdir" value="{{workDir}}" />
<input type="hidden" name="subfolder" id="subfolder" value="" /> <input type="hidden" name="subfolder" id="subfolder" value="" />
...@@ -16,7 +15,6 @@ ...@@ -16,7 +15,6 @@
<h2>Manage your repository</h2> <h2>Manage your repository</h2>
<label for='project'>Select your project into the list: </label> <label for='project'>Select your project into the list: </label>
<select id="project" name="project"> <select id="project" name="project">
<option value=""></option>
{% for folder in project%} {% for folder in project%}
<option value="{{folder}}">{{folder}}</option> <option value="{{folder}}">{{folder}}</option>
{% endfor %} {% endfor %}
......
{% extends "layout.html" %}
{% block title %}Your current software folder{% endblock %}
{% block head %}
{{ super() }}
<link href="{{ url_for('static', filename='css/jqueryFileTree.css', _external=False) }}" rel="stylesheet" type="text/css" media="screen" />
<script src="{{ url_for('static', filename='jquery/jqueryFileTree.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='scripts/softwareFolder.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='ace/ace-uncompressed.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='ace/theme-crimson_editor.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='ace/mode-buildout.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='ace/mode-python.js') }}" type="text/javascript" charset="utf-8"></script>
<script src="{{ url_for('static', filename='ace/mode-php.js') }}" type="text/javascript" charset="utf-8"></script>
{% endblock %}
{% block body %}
<form action="" method=post>
<input type="hidden" name="project" id="project" value="{{project}}" />
<input type="hidden" name="workdir" id="workdir" value="{{workDir}}" />
<input type="hidden" name="subfolder" id="subfolder" value="" />
<div id="file_navigation">
<h2>Current software file content</h2>
<div id="fileTree" class="file_tree_short"></div>
<div class="box_software">
<h2>Add new file or folder</h2>
<input type="text" name="file" id="file" size='25' value="Enter name here..." />
&nbsp;&nbsp;<select name="type" id="type">
<option value="file">file</option>
<option value="folder">folder</option>
</select>
&nbsp;&nbsp;<input type="submit" name="add" id ="add" value="Add" class="button"/>
<div id="file_info" class="file_info"><span id="info">Please select your file or folder into the box...</span></div>
</div>
<div class="clear"></div>
<div id="code" style="margin-top:10px">
<h2 id="edit_info">Edit your selected file</h2>
<div class="main_content">
<pre id="editor">
</pre>
</div>
<input type=submit value=Update id="save" class="button">
</div>
</div>
</form>
{% endblock %}
...@@ -269,7 +269,7 @@ def getProjectList(folder): ...@@ -269,7 +269,7 @@ def getProjectList(folder):
project.append(elt) project.append(elt)
return project return project
def newSoftware(folder, config): def newSoftware(folder, config, session):
json = "" json = ""
code = 0 code = 0
runner_dir = config['runner_workdir'] runner_dir = config['runner_workdir']
......
...@@ -200,7 +200,7 @@ def openFolder(): ...@@ -200,7 +200,7 @@ def openFolder():
@app.route('/createSoftware', methods=['POST']) @app.route('/createSoftware', methods=['POST'])
def createSoftware(): def createSoftware():
return newSoftware(request.form['folder'], app.config) return newSoftware(request.form['folder'], app.config, session)
@app.route("/checkFolder", methods=['POST']) @app.route("/checkFolder", methods=['POST'])
def checkFolder(): def checkFolder():
...@@ -218,9 +218,43 @@ def setCurentProject(): ...@@ -218,9 +218,43 @@ def setCurentProject():
@app.route("/manageProject", methods=['GET']) @app.route("/manageProject", methods=['GET'])
def manageProject(): def manageProject():
return render_template('manageProject.html', workDir=app.config['workspace'], return render_template('manageProject.html', workDir=app.config['workspace'],
project=getProjectList(app.config['workspace'])) project=getProjectList(app.config['workspace']))
@app.route("/getProjectStatus", methods=['POST']) @app.route("/getProjectStatus", methods=['POST'])
def getProjectStatus(): def getProjectStatus():
return gitStatus(app.config, request.form['project']) return gitStatus(app.config, request.form['project'])
\ No newline at end of file
@app.route("/curentSoftware")
def curentSoftware():
project = os.path.join(app.config['runner_workdir'], ".project")
if os.path.exists(project):
return render_template('softwareFolder.html', workDir=app.config['workspace'],
project=open(project).read())
return redirect(url_for('configRepo'))
@app.route("/createFile", methods=['POST'])
def createFile():
try:
if request.form['type'] == "file":
f = open(request.form['file'], 'w').write(" ")
else:
os.mkdir(request.form['file'])
return jsonify(code=1, result="")
except Exception, e:
return jsonify(code=0, result=str(e))
@app.route("/getFileContent", methods=['POST'])
def getFileContent():
if os.path.exists(request.form['file']):
return jsonify(code=1, result=open(request.form['file'], 'r').read())
else:
return jsonify(code=0, result="Error: No such file!")
@app.route("/saveFileContent", methods=['POST'])
def saveFileContent():
if os.path.exists(request.form['file']):
open(request.form['file'], 'w').write(request.form['content'])
return jsonify(code=1, result="")
else:
return jsonify(code=0, result="Error: No such file!")
\ No newline at end of file
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment