Skip to content

Instantly share code, notes, and snippets.

@theblacksquid

theblacksquid/bi-background-lines.png

Last active July 18, 2016 04:22
Show Gist options
  • Save theblacksquid/c4a4eb0a0d37f3ca14b407d35b4caaba to your computer and use it in GitHub Desktop.
Save theblacksquid/c4a4eb0a0d37f3ca14b407d35b4caaba to your computer and use it in GitHub Desktop.
Download ZIP
Sigil Pal (UI and Logic) implemented in Coffeescript || <3
Raw
blended_layout.css
*{
padding : 0;
margin : 0;
border : 0;
}
body{
background-image : url('bi-background-lines.png');
background-attachment : fixed;
background-size : 100% auto;
background-color : rgba(203,203,203,1);
}
.blended_grid{
display : block;
width : 900px;
overflow : auto;
margin : 30px auto 0 auto;
}
.pageHeader{
background-color : rgba(0, 0, 0, 0.5);
float : left;
clear : none;
height : 25vh;
width : 67.3vw;
padding-left : 2.5%;
padding-top : 1.25%;
}
.pageLeftMenu{
background-color : rgba(0, 0, 0, 0.5);
float : left;
clear : none;
height : 100vh;
width : 35.2vw;
padding-left : 2.5%;
padding-top : 1.25%;
}
.pageContent{
background-color : rgba(0, 0, 0, 0.5);
float : left;
clear : none;
height : 100vh;
width : 44%;
padding-left : 2.5%;
padding-top : 1.25%;
}
.pageFooter{
background-color : rgba(0, 0, 0, 0.5);
float : left;
clear : none;
height : 25vh;
width : 67.3vw;
padding-left : 2.5%;
padding-top : 1.25%;
}
#soi {
width : 100%;
height : 150px;
}
#process {
width: 100%
}
Raw
index.coffee
class MainView
constructor: (@el) ->
render: ->
template = ->
"""
<div class='blended_grid'>
<div class='pageHeader'>
<h1>Sigil Pal</h1>
<h3>automated Statement of intent processor</h3>
</div>
<div class='pageLeftMenu'>
<textarea type='text' id='soi' placeholder='type your intent here'></textarea>
<br />
<button id='process'>Process Statement of Intent</button>
</div>
<div class='pageContent'>
<div id='result'></div>
<br />
<p>To find more info on the process of</p>
<p>sigilization and magick in general</p>
<p>go <a href='http://www.excommunicate.com/basics-in-sigil-creation-or-the-only-magic-guaranteed-to-work/#axzz4Ej3q2KlR'>here</a> or <a href='http://www.chaosmatrix.org/library/chaos_all.php'>here</a> for more detailed information.</p>
</div>
<div class='pageFooter'>
<h4><a href='https://github.com/theblacksquid'>@theblacksquid</a> 2016</h4>
</div>
</div>
"""
$(@el).append template()
@resultView()
resultView: ->
template = (input) ->
"""
<div>
<h3>#{$('#soi').val()}</h3>
<p>Base Letters: #{input.BaseChars}</p>
<p>Numeric Value: #{input.NumVal}</p>
<p>Seed Number: #{input.SeedNum}</p>
</div>
"""
$("#process").click(->
text = $("#soi").val()
$("#result").html template(digest text)
)
myView = new MainView("#app")
myView.render()
Raw
index.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Sigil Pal</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<meta name="generator" content="Geany 1.28" />
<link rel="stylesheet" type="text/css" href="blended_layout.css">
</head>
<body>
<div id="app"></div>
<script src="https://code.jquery.com/jquery-3.1.0.js"></script>
<script src="sigil_pal.js"></script>
<script src="index.js"></script>
</body>
</html>
Raw
index.js
// Generated by CoffeeScript 1.10.0
(function() {
var MainView, myView;
MainView = (function() {
function MainView(el) {
this.el = el;
}
MainView.prototype.render = function() {
var template;
template = function() {
return "<div class='blended_grid'>\n\n <div class='pageHeader'>\n <h1>Sigil Pal</h1>\n <h3>automated Statement of intent processor</h3>\n </div>\n \n <div class='pageLeftMenu'>\n <textarea type='text' id='soi' placeholder='type your intent here'></textarea>\n <br />\n <button id='process'>Process Statement of Intent</button>\n </div>\n \n <div class='pageContent'>\n <div id='result'></div>\n <br />\n <p>To find more info on the process of</p>\n <p>sigilization and magick in general</p>\n <p>go <a href='http://www.excommunicate.com/basics-in-sigil-creation-or-the-only-magic-guaranteed-to-work/#axzz4Ej3q2KlR'>here</a> or <a href='http://www.chaosmatrix.org/library/chaos_all.php'>here</a> for more detailed information.</p>\n </div> \n <div class='pageFooter'>\n <h4><a href='https://github.com/theblacksquid'>@theblacksquid</a> 2016</h4>\n </div>\n</div>";
};
$(this.el).append(template());
return this.resultView();
};
MainView.prototype.resultView = function() {
var template;
template = function(input) {
return "<div>\n <h3>" + ($('#soi').val()) + "</h3>\n <p>Base Letters: " + input.BaseChars + "</p>\n <p>Numeric Value: " + input.NumVal + "</p>\n <p>Seed Number: " + input.SeedNum + "</p>\n</div>";
};
return $("#process").click(function() {
var text;
text = $("#soi").val();
return $("#result").html(template(digest(text)));
});
};
return MainView;
})();
myView = new MainView("#app");
myView.render();
}).call(this);
Raw
sigil_pal.coffee
numerology = {
'A': 1, 'B': 2, 'C': 3,
'D': 4, 'E': 5, 'F': 6,
'G': 7, 'H': 8, 'I': 9,
'J': 10, 'K': 11, 'L': 12,
'M': 13, 'N': 14, 'O': 15,
'P': 16, 'Q': 17, 'R': 18,
'S': 19, 'T': 20, 'U': 21,
'V': 22, 'W': 23, 'X': 24,
'Y': 25, 'Z': 26
}
getNumVal = (str) ->
arr = str.replace(/[^a-zA-Z ]/g, "")
.toUpperCase()
.split("")
.filter((value) -> not (value is " "))
numbers = []
arr.forEach ((val) -> numbers.push numerology[val])
numbers.reduce ((x,y) -> x + y)
getSeedNum = (num) ->
arr = num.toString()
.split("")
.map ((x) -> + x)
while arr.length > 1
result = arr
result = result.reduce ((x, y) -> x + y)
arr = result.toString()
.split("")
.map((x) -> + x)
while arr[0] < 3 # not sure about the implications
arr[0] = arr[0] + 1 # of turning 2's and 1's into 3's
# in a numerological sense
arr[0]
getBaseChars = (str) ->
arr = str.replace(/[^a-zA-Z ]/g, "")
.toUpperCase()
.split("")
.filter ((x) -> not (x is " "))
result = []
arr.forEach ((x) ->
if not (result.includes x)
result.push x
)
result
digest = (str) ->
result = {
BaseChars: getBaseChars str
NumVal: getNumVal str
SeedNum: getSeedNum getNumVal(str)
}
Raw
sigil_pal.js
// Generated by CoffeeScript 1.10.0
var digest, getBaseChars, getNumVal, getSeedNum, numerology;
numerology = {
'A': 1,
'B': 2,
'C': 3,
'D': 4,
'E': 5,
'F': 6,
'G': 7,
'H': 8,
'I': 9,
'J': 10,
'K': 11,
'L': 12,
'M': 13,
'N': 14,
'O': 15,
'P': 16,
'Q': 17,
'R': 18,
'S': 19,
'T': 20,
'U': 21,
'V': 22,
'W': 23,
'X': 24,
'Y': 25,
'Z': 26
};
getNumVal = function(str) {
var arr, numbers;
arr = str.replace(/[^a-zA-Z ]/g, "").toUpperCase().split("").filter(function(value) {
return !(value === " ");
});
numbers = [];
arr.forEach((function(val) {
return numbers.push(numerology[val]);
}));
return numbers.reduce((function(x, y) {
return x + y;
}));
};
getSeedNum = function(num) {
var arr, result;
arr = num.toString().split("").map((function(x) {
return +x;
}));
while (arr.length > 1) {
result = arr;
result = result.reduce((function(x, y) {
return x + y;
}));
arr = result.toString().split("").map(function(x) {
return +x;
});
}
while (arr[0] < 3) {
arr[0] = arr[0] + 1;
}
return arr[0];
};
getBaseChars = function(str) {
var arr, result;
arr = str.replace(/[^a-zA-Z ]/g, "").toUpperCase().split("").filter((function(x) {
return !(x === " ");
}));
result = [];
arr.forEach((function(x) {
if (!(result.includes(x))) {
return result.push(x);
}
}));
return result;
};
digest = function(str) {
var result;
return result = {
BaseChars: getBaseChars(str),
NumVal: getNumVal(str),
SeedNum: getSeedNum(getNumVal(str))
};
};
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment