truck/Sahli
1
0
Fork 0
Code Issues Pull requests Releases Wiki Activity

basic form - needs some more changes but basics are there.

Browse source
This commit is contained in:
Howland Owl 2014-04-14 20:09:27 +03:00
parent ec7acc5c3b
commit de82467f77
3 changed files with 151 additions and 15 deletions
Download patch file Download diff file Expand all files Collapse all files

17
editor/sahliedit.css Normal file
View file

@ -0,0 +1,17 @@
label, input, textarea{
display: block;
}
input, textarea {
width: 90%;
}
textarea {
height: 8em;
}
.colorbox {
border: 0;
padding: 0;
height: 2em;
}

41
editor/sahliedit.litcoffee
View file

@ -24,16 +24,27 @@ We need to make a screen that has a few things in it for starters
Title, load existing, and new file options. Title, load existing, and new file options.
Silliness for checking that this works. Silliness for checking that this works.
$(-> $("h1").hide().slideDown(500)) $(-> $("h1").hide().slideDown(500))
Create a split button to choose between the New and Load functionalities Create a split button to choose between the New and Load functionalities
(As we aren't going to ever load a file _and_ do a new file.) (As we aren't going to ever load a file _and_ do a new file.)
(If someone wants to do that, they can restart with F5 or something.) (If someone wants to do that, they can restart with F5 or something.)
Also hide the hidden things.
$(-> $(->
$("#newsahli") $("#newsahli")
.button { disabled: false} .button { disabled: false}
.click -> newsahli 'new' .click ->
newsahli 'new'
$("#formica").dialog {
width:'800',
modal: false,
title:'Line Item', buttons: [{
text: "OK",
click: ->
$(@).dialog "close"
}] }
) )
$(-> $(->
@ -41,6 +52,10 @@ Create a split button to choose between the New and Load functionalities
.button { disabled: false} .button { disabled: false}
.click -> alert "heyoh!" .click -> alert "heyoh!"
) )
$(->
$(".hidden").hide()
$(".45box").css {width:'45%',float:'left'}
)
The sahli file definition format is as follows: The sahli file definition format is as follows:
@ -79,10 +94,32 @@ a html template, and a css file.
"filedef": [ @filedef ] "filedef": [ @filedef ]
} }
loader: ->
alert "loader"
editor: (data) ->
alert dumpjson data
A Helper function to dump json out of an object as text:
dumpjson = (obj) -> dumpjson = (obj) ->
JSON.stringify(obj) JSON.stringify(obj)
When clicking 'New' we want to make a brand new Sahli, and then clear out
the buttons and create the editor bit as blank.
newsahli = -> newsahli = ->
sahli = new Sahli sahli = new Sahli
alert dumpjson sahli $('#buttonbox').hide()
sahli.data = sahli.blank
sahli.editor sahli.data.filedef

84
editor/sahlieditor.html
View file

@ -4,16 +4,98 @@
<script src="//code.jquery.com/jquery-2.1.0.min.js" type="text/javascript" charset="utf-8"></script> <script src="//code.jquery.com/jquery-2.1.0.min.js" type="text/javascript" charset="utf-8"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.min.js" type="text/javascript" charset="utf-8" ></script> <script src="//code.jquery.com/ui/1.10.4/jquery-ui.min.js" type="text/javascript" charset="utf-8" ></script>
<script src="/editor/sahliedit.js" type="text/javascript" charset="utf-8" async defer></script> <script src="/editor/sahliedit.js" type="text/javascript" charset="utf-8" async defer></script>
<link rel="stylesheet" href="/editor/sahliedit.css">
<link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/dot-luv/jquery-ui.css"> <link rel="stylesheet" href="//code.jquery.com/ui/1.10.4/themes/dot-luv/jquery-ui.css">
</head> </head>
<body> <body>
<h1>Sahli Editor</h1> <h1>Sahli Editor</h1>
<div id='editbox'> <div id='editbox'>
<div> <div id='buttonbox'>
<button id='newsahli'>New</button> <button id='newsahli'>New</button>
<button id='loadsahli'>Load</button> <button id='loadsahli'>Load</button>
</div> </div>
</div> </div>
<div class='hidden' id='formica'>
<form action="sahlieditor_submit" method="get" accept-charset="utf-8">
<ol>
<div class='groupbox' id='basics'>
<p>Basics:</p>
<div>
<ul>
<label for="file">File name:</label>
<input type="file" name="file" value="" placeholder="">
</ul>
<ul>
<label for="file">Title:</label>
<input type="text" name="name" value="" placeholder="">
</ul>
<ul>
<label for="author">Author's name:</label>
<input type="text" name="author" value="" placeholder="">
</ul>
</div>
</div>
<div class='groupbox' id='displaydata'>
<p>Display:</p>
<div>
<ul>
<label for="file">Ascii or Ansi?</label>
<button name="amiga" id='amiga'>Ascii?</button>
</ul>
<ul>
<label for="width">With of file:</label>
<input type="number" name="width" value="80" placeholder="">
</ul>
<ul>
<label for="font">Font:</label>
<select name="font">
<option value="Propaz">Propaz</option>
<option value="Topaz13">Topaz13</option>
<option value="mOsOul">mOsOul</option>
<option value="MicroKnight">Microknight</option>
<option value="Ansifont">Ansifont</option>
</select>
</ul>
<div class='45box'>
<ul>
<label for="color">Text Color:</label>
<input type="color" name="color" value="#D0D0D0" placeholder="" class="colorbox">
</ul>
<ul>
<label for="bg">Background color:</label>
<input type="color" name="bg" value="#000000" placeholder="" class="colorbox">
</ul>
</div>
<div class='45box'>
<pre>
________________________, ._____,
| ___|___ | | | | |_____|
|_____ | _ | | |__| |
|_____|_____|___|__|______|___|
</pre>
</div>
</div>
</div>
<div class='groupbox' id='optionals'>
<p>Optional text:</p>
<div>
<ul>
<label for="line1">Optional Info line 1:</label>
<input type="text" name="line1" value="" placeholder="">
</ul>
<ul>
<label for="line2">Optional Info line 2:</label>
<input type="text" name="line2" value="" placeholder="">
</ul>
<ul>
<label for="text">Optional Text (notes, comments, etc):</label>
<textarea name='text'></textarea>
</ul>
</div>
</ol>
</form>
</div>
</body> </body>
</html> </html>