initial integration of text editor

This commit is contained in:
Kyle Drake 2013-06-03 22:32:39 -07:00
parent 4e4ef8799d
commit 44d785e222
5 changed files with 94 additions and 2 deletions

5
app.rb
View file

@ -148,6 +148,11 @@ post '/site_files/delete' do
redirect '/dashboard'
end
get '/site_files/text_editor/:filename' do |filename|
@file_url = "http://#{current_site.username}.neocities.org/#{filename}"
slim :'site_files/text_editor'
end
get '/terms' do
slim :'terms'
end

View file

@ -17,4 +17,8 @@ textarea, input[type="text"], input[type="password"], input[type="datetime"], in
#file_criteria li {
padding-bottom: 20px;
}
select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input {
color: #000000;
}

View file

@ -34,7 +34,7 @@ javascript:
a href="#" Edit with visual editor <small>not implemented yet.. ETA one week</small> <br>
span
i class="icon-edit" &nbsp;&nbsp;
a href="#" Edit with text editor <small>not implemented yet.. ETA one day</small><br>
a href="/site_files/text_editor/#{file.filename}" Edit with text editor <small>not implemented yet.. ETA one day</small><br>
span
i class="icon-trash" &nbsp;&nbsp;
a href="#" onclick="confirmFileDelete('#{file.filename}')" Delete

View file

@ -9,6 +9,7 @@ html
link href="/css/styles.css" rel="stylesheet"
meta property="og:title" content="NeoCities"
meta property="og:description" content="NeoCities is the new Geocities. Create your own free home page, and do whatever you want with it."
script src="/js/jquery.min.js"
body
a id="top"
@ -33,5 +34,4 @@ html
container
== yield
script src="/js/jquery.min.js"
script src="/js/bootstrap.min.js"

View file

@ -0,0 +1,83 @@
css:
#editor {
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
.row
.span6
font style="font-size: 27pt" Editing #{params[:filename]}
.span6
span.pull-right
| Theme:
select id="theme" size="1" onchange="setTheme();" onkeyup="setTheme();"
optgroup label="Bright"
option value="ace/theme/chrome" Chrome
option value="ace/theme/clouds" Clouds
option value="ace/theme/crimson_editor" Crimson Editor
option value="ace/theme/dawn" Dawn
option value="ace/theme/dreamweaver" Dreamweaver
option value="ace/theme/eclipse" Eclipse
option value="ace/theme/github" GitHub
option value="ace/theme/solarized_light" Solarized Light
option value="ace/theme/textmate" TextMate
option value="ace/theme/tomorrow" Tomorrow
option value="ace/theme/xcode" XCode
optgroup label="Dark"
option value="ace/theme/ambiance" Ambiance
option value="ace/theme/chaos" Chaos
option value="ace/theme/clouds_midnight" Clouds Midnight
option value="ace/theme/cobalt" Cobalt
option value="ace/theme/idle_fingers" idleFingers
option value="ace/theme/kr_theme" krTheme
option value="ace/theme/merbivore" Merbivore
option value="ace/theme/merbivore_soft" Merbivore Soft
option value="ace/theme/mono_industrial" Mono Industrial
option value="ace/theme/monokai" Monokai
option value="ace/theme/pastel_on_dark" Pastel on dark
option value="ace/theme/solarized_dark" selected="selected" Solarized Dark
option value="ace/theme/terminal" Terminal
option value="ace/theme/tomorrow_night" Tomorrow Night
option value="ace/theme/tomorrow_night_blue" Tomorrow Night Blue
option value="ace/theme/tomorrow_night_bright" Tomorrow Night Bright
option value="ace/theme/tomorrow_night_eighties" Tomorrow Night 80s
option value="ace/theme/twilight" Twilight
option value="ace/theme/vibrant_ink" Vibrant Ink
.row
.span12
div id="editor" style="width: 100%; height: 1000px; position: relative;"
p Loading, please wait..
.row.text-center style="margin-top: 10px"
.span4
a.btn.btn-large.btn-warning href="" Cancel
.span4
a.btn.btn-large.btn-success href="" Save Changes
.span4
a.btn.btn-large.btn-info href="" Save and Finish Editing
script src="http://rawgithub.com/ajaxorg/ace-builds/master/src-noconflict/ace.js" type="text/javascript" charset="utf-8"
javascript:
function setTheme(name) {
editor.setTheme($('#theme').val());
}
var editor = {};
$(document).ready(function() {
$.get("#{@file_url}", function (response) {
$("#editor").text(response);
editor = ace.edit("editor");
setTheme();
editor.getSession().setMode("ace/mode/html");
editor.setFontSize(14);
editor.setShowPrintMargin(false);
});
});