Skip to content

GitLab

Commit ef0fec26 authored by Alexandre Leray's avatar Alexandre Leray
Browse files

Continued modularizing the javascripts

parent bb746dc0
Expand all Hide whitespace changes
Inline Side-by-side
aawiki/static/aawiki/css/aa.annotations.css
View file @ ef0fec26
/* annotations {{{ */
section.section1 {
background-color: white;
border: 1px solid #ddd;
border: 1px solid whitesmoke;
position: absolute !important;
top: 0;
left: 0;
......@@ -48,7 +48,8 @@ section.section1[about] span.about {
section.section1 h2 {
font-size: 13px;
line-height: 18px;
line-height: 16px;
text-align: right;
/*font-weight: bold;*/
/*font-family: 'News Cycle'; */
/*letter-spacing: 1px;*/
......@@ -56,7 +57,7 @@ section.section1 h2 {
section.section1 h2,
section.section1 p {
margin-bottom: 18px;
margin-bottom: 16px;
}
section.section1 h2:last-child,
section.section1 p:last-child {
......@@ -64,9 +65,9 @@ section.section1 p:last-child {
}
/* SECTION 2 ---------- */
section.section2 {
border-top: 1px solid darkgray;
border-top: 1px solid whitesmoke;
margin-top: -1px;
padding-bottom: 18px;
padding-bottom: 16px;
}
/* }}} */
......@@ -78,7 +79,7 @@ section.editing div.wrapper {
section.editing textarea {
width: 100%;
box-sizing: border-box;
-webkit-box-sizing:border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
-ms-box-sizing: border-box;
border: 1px solid black;
......@@ -86,7 +87,7 @@ section.editing textarea {
padding: 5px;
resize: none;
font-size: 11px;
line-height: 15px;
line-height: 16px;
}
/* }}} */
......@@ -159,5 +160,31 @@ section.collapsed span.edit {
}
.active {
background-color: yellow;
background-color: paleGreen;
}
/* timecodes {{{ */
span[property="aa:start"],
span[property="aa:end"] {
color: gray;
font-size: smaller;
}
span[property="aa:start"]:hover,
span[property="aa:end"]:hover {
cursor: pointer;
color: blue;
}
span[property="aa:start"]:after {
content: "\00A0\2192\00A0";
}
span[property="aa:start"]:last-child:after {
content: "\00A0\2192\00A0 ?";
}
span[property="aa:end"].deduced:after {
content: ")";
}
span[property="aa:end"].deduced:before {
content: "(";
}
/* }}} */
aawiki/static/aawiki/css/aa.rdfa.css 0 → 100644
View file @ ef0fec26
[property] {
border-bottom: 2px solid red;
cursor: pointer;
}
aawiki/static/aawiki/css/aa.wiki.css 0 → 100644
View file @ ef0fec26
@font-face {
font-family: 'News Cycle';
src: url('/static/lib/fonts/NewsCycle-Regular-webfont.eot');
src: url('/static/lib/fonts/NewsCycle-Regular-webfont.eot?#iefix') format('embedded-opentype'),
url('/static/lib/fonts/NewsCycle-Regular-webfont.woff') format('woff'),
url('/static/lib/fonts/NewsCycle-Regular-webfont.ttf') format('truetype'),
url('/static/lib/fonts/NewsCycle-Regular-webfont.svg#NewsCycleRegular') format('svg');
font-weight: normal;
font-style: normal;
}
body {
font-family: 'News Cycle', sans;
font-size: 13px;
line-height: 16px;
}
aawiki/static/aawiki/css/activearchives.css
View file @ ef0fec26
......@@ -160,7 +160,6 @@ marquee { overflow: visible;
url('/static/lib/fonts/NewsCycle-Regular-webfont.svg#NewsCycleRegular') format('svg');
font-weight: normal;
font-style: normal;
}
/* }}} */
......
aawiki/static/aawiki/js/aa.embeds.js
View file @ ef0fec26
......@@ -23,8 +23,10 @@ $(function() {
/* REFRESH */
// The refresh event gets fired on #canvas initially
// then on any <section> or other dynamically loaded/created element to "activate" it
$canvas.bind("refresh", function (evt) {
$(context).add('#sidebar').find("[rel='aa:embed']").each(function () {
var embedUrl = $('link[rel="aa-embed"]').attr("href");
//$("body").bind("refresh", function (evt) {
$("[rel='aa:embed']").each(function () {
var that = this;
function poll () {
$.ajax(embedUrl, {
......@@ -86,7 +88,7 @@ $(function() {
});
// Embed Links show/hide on rollover
$(context).ffind("div.aa_embed").each(function () {
$("body").ffind("div.aa_embed").each(function () {
$(this).mouseover(function () {
$(".links", this).show();
}).mouseout(function () {
......@@ -96,7 +98,7 @@ $(function() {
// DIRECTLINKs
// Make directlinks draggable
$("a.directlink", context).each(function () {
$("a.directlink").each(function () {
$(this).draggable({
helper: function () {
return $(this).clone().appendTo("body");
......@@ -105,7 +107,7 @@ $(function() {
});
// h1's are droppable to set about
$(context).ffind(".section1").find("h1").droppable({
$("body").ffind(".section1").find("h1").droppable({
accept: ".directlink",
hoverClass: "drophover",
drop: function (evt, ui) {
......@@ -116,7 +118,7 @@ $(function() {
resetTimelines();
}
});
})
//})
});
/* vim: set foldmethod=indent: */
aawiki/static/aawiki/js/jquery.aa.annotation.js
View file @ ef0fec26
//depends on jquery.ffind.js
//depends on jquery.wrapContent.js
/**
* This file is part of Active Archives.
* Copyright 2006-2012 the Active Archives contributors (see AUTHORS)
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
* Also add information on how to contact you by electronic and paper mail.
*/
// depends on jquery.ffind.js
// depends on jquery.wrapContent.js
(function( $ ){
var api = $('link[rel="alternate"][type="application/json"]').attr("href");
var createAboutButton = function () {
//return $("<span>").text("@").addClass('about').attr('title', 'Highlight the object this annotation is about');
return $("<span>").addClass('icon-link').attr('title', 'Highlight the object this annotation is about');
......@@ -18,13 +41,13 @@
}
var createSaveButton = function () {
return $("<span>").text("✔").addClass('save').attr('title', 'Save changes').on("click", function () {
return $("<span>").addClass("icon-ok").addClass('save').attr('title', 'Save changes').on("click", function () {
$(this).closest("section").trigger("save");
});
}
var createCancelButton = function () {
return $("<span>").text("✘").addClass('cancel').attr('title', 'Cancel changes').on("click", function () {
return $("<span>").addClass("icon-remove").addClass('cancel').attr('title', 'Cancel changes').on("click", function () {
$(this).closest("section").trigger("cancel");
});
}
......@@ -46,33 +69,22 @@
var renumberSections = function () {
$('section').not('[data-section="-1"]').each(function (i) {
$(this).attr("data-section", (i + 1));
console.log($(this).data('section'));
});
};
var onSectionCancelTriggered = function (event) {
event.stopPropagation()
var quitEditMode = function () {
$(this).find(":header").first().find(".save").remove();
$(this).find(":header").first().find(".cancel").remove();
$(this).find(".section_edit").first().remove();
$(this).removeClass("editing");
console.log($(this).get(), "was cancelled");
}
var onSectionSaveTriggered = function (event) {
event.stopPropagation()
console.log($(this).get(), "was saved");
}
};
var onSectionEditTriggered = function (event) {
event.stopPropagation()
var height = $(this).first(".wrapper").height();
var textarea = $("<textarea>").height(height);
var textarea = $("<textarea>").height(height - 4);
$(this).append($('<div class="section_edit">').append(textarea));
$(this).find(":header").first().append(createCancelButton());
......@@ -80,28 +92,64 @@
$(this).addClass("editing");
$.ajax("/api/v1/page/BlaBlaBla/section/" + $(this).data("section"), {
$.ajax(api + "/section/" + $(this).data("section"), {
dataType: 'json',
beforeSend: function () {
textarea.attr("disabled", "disabled").val("loading...")
console.log("before send");
},
success: function (data) {
textarea.val(data.content).removeAttr("disabled");
},
error: function (xhr, ajaxOptions, thrownError) {
alert("An error occured: " + xhr.status + " " + thrownError);
},
complete: function () {
console.log("completed");
}
});
}
var onSectionCancelTriggered = function (event) {
event.stopPropagation()
quitEditMode.apply(this);
}
var onSectionSaveTriggered = function (event) {
event.stopPropagation()
var that = this;
var textarea = $(this).find(".section_edit").find("textarea");
var content = textarea.val();
$.ajax(api + "/section/" + $(this).data("section") + '/', {
type: 'PUT',
contentType: 'application/json',
dataType: 'json',
data: JSON.stringify({content: content}),
beforeSend: function () {
textarea.attr("disabled", "disabled");
},
success: function (data) {
textarea.val(data.content).removeAttr("disabled");
var newSection = $(data.html);
quitEditMode.apply(that);
foo.apply(newSection);
$(that).replaceWith(newSection);
renumberSections();
},
error: function (xhr, ajaxOptions, thrownError) {
alert("An error occured: " + xhr.status + " " + thrownError);
textarea.removeAttr("disabled");
},
complete: function () {
}
});
}
var onSectionGeometryChangeTriggered = function (event) {
event.stopPropagation()
console.log(this, "changed geometry");
}
var onHeaderDblClickTriggered = function (event) {
......@@ -115,6 +163,65 @@
}
}
var bar = function () {
console.log(this);
$(this).ffind("section").wrapContent();
$(this).find(":header")
.append(createEditButton);
$(this).find("h1").attr('title', 'Drag to move. Double-click to open/close.')
.prepend(createAboutButton);
$(this).find("h2").attr('title', 'Double-click to open/close.');
};
var foo = function () {
console.log(this);
bar.apply(this);
$(this).on("geometrychange", onSectionGeometryChangeTriggered);
$(this).ffind("section").on("edit", onSectionEditTriggered)
.on("save", onSectionSaveTriggered)
.on("cancel", onSectionCancelTriggered);
$(this).find(":header").on("dblclick", onHeaderDblClickTriggered);
$(this).on('mousedown', function (event) {
event.stopPropagation();
}).draggable({
cancel: 'span.edit',
scroll: true,
handle: 'h1',
distance: 20,
drag: function (event, ui) {
if (event.ctrlKey) {
$("html").addClass("grid");
ui.position.left = Math.floor(ui.position.left / 20) * 20;
ui.position.top = Math.floor(ui.position.top / 20) * 20;
} else {
$("html").removeClass("grid");
}
},
stop: function () {
constraintAnnotation(this);
$("html").removeClass("grid");
$(this).trigger('geometrychange');
}
}).resizable({
resize: function (event, ui) {
if (event.ctrlKey) {
ui.size.width = Math.floor(ui.size.width / 20) * 20;
ui.size.height = Math.floor(ui.size.height / 20) * 20;
$("html").addClass("grid");
} else {
$("html").removeClass("grid");
}
},
stop: function () {
$(this).trigger('geometrychange');
}
});
}
var methods = {
init : function (options) {
var settings = $.extend({
......@@ -123,61 +230,7 @@
renumberSections();
return this.each(function (i) {
$(this).ffind("section").wrapContent();
$(this).find(":header")
.prepend(createAboutButton)
.append(createEditButton);
$(this).find("h1").attr('title', 'Drag to move. Double-click to open/close.');
$(this).find("h2").attr('title', 'Double-click to open/close.');
$(this).on("geometrychange", onSectionGeometryChangeTriggered);
$(this).ffind("section").on("edit", onSectionEditTriggered)
.on("save", onSectionSaveTriggered)
.on("cancel", onSectionCancelTriggered);
$(this).find(":header").on("dblclick", onHeaderDblClickTriggered);
$(this).on('mousedown', function (event) {
event.stopPropagation();
}).draggable({
//snap: ".anchor",
//snapMode: "inner",
cancel: 'span.edit',
scroll: true,
handle: 'h1',
distance: 20,
//delay: 200, // NOTE: Prevents unwanted saves
//containment: "parent",
//scroll: true,
drag: function (event, ui) {
if (event.ctrlKey) {
$("html").addClass("grid");
ui.position.left = Math.floor(ui.position.left / 20) * 20;
ui.position.top = Math.floor(ui.position.top / 20) * 20;
} else {
$("html").removeClass("grid");
}
},
stop: function () {
constraintAnnotation(this);
$("html").removeClass("grid");
$(this).trigger('geometrychange');
}
}).resizable({
resize: function (event, ui) {
if (event.ctrlKey) {
ui.size.width = Math.floor(ui.size.width / 20) * 20;
ui.size.height = Math.floor(ui.size.height / 20) * 20;
$("html").addClass("grid");
} else {
$("html").removeClass("grid");
}
},
stop: function () {
$(this).trigger('geometrychange');
}
});
foo.apply(this);
})
},
destroy: function () {
......
aawiki/static/aawiki/js/jquery.aa.classSwitcher.js
View file @ ef0fec26
......@@ -21,8 +21,6 @@
(function( $ ){
var methods = {
init : function (options) {
console.log(options);
var settings = $.extend( {
target : 'body',
end : function () {}
......
aawiki/static/aawiki/js/jquery.contextual-menu.js 0 → 100644
View file @ ef0fec26
/**
* This file is part of Active Archives.
* Copyright 2006-2012 the Active Archives contributors (see AUTHORS)
*
* This program is free software: you can redistribute it and/or modify
* it under the terms of the GNU Affero General Public License as
* published by the Free Software Foundation, either version 3 of the
* License, or (at your option) any later version.
*
* This program is distributed in the hope that it will be useful,
* but WITHOUT ANY WARRANTY; without even the implied warranty of
* MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the
* GNU Affero General Public License for more details.
*
* You should have received a copy of the GNU Affero General Public License
* along with this program. If not, see <http://www.gnu.org/licenses/>.
* Also add information on how to contact you by electronic and paper mail.
*/
//<menu type="toolbar">
//<li>
//<menu label="File">
//<button type="button" onclick="new()">New...</button>
//<button type="button" onclick="save()">Save...</button>
//</menu>
//</li>
//<li>
//<menu label="Edit">
//<button type="button" onclick="cut()">Cut...</button>
//<button type="button" onclick="copy()">Copy...</button>
//<button type="button" onclick="paste()">Paste...</button>
//</menu>
//</li>
//</menu>
//<menu>
//<command type="command" label="Save" onclick="save()">Save</command>
//</menu>
(function ($) {
$(document).ready(function() {
var menu;
function singleClick(event) {
if (! menu) {
menu = $("<ul><li><button><i class='icon-plus'></i> Create annotation</button></li></ul>").css({
left: event.clientX,
top: event.clientY,
position: "absolute"
}).appendTo($("body"));
} else {
menu.remove()
menu = undefined;
};
}
function doubleClick(event) {
if (! menu) {
menu = $("<ul><li><button><i class='icon-plus'></i> Create foobar</button></li></ul>").css({
left: event.clientX,
top: event.clientY,
position: "absolute"
}).appendTo($("body"));
} else {
menu.remove()
menu = undefined;
};
}
$("html").click(function(event) {
var that = this;
setTimeout(function() {
var dblclick = parseInt($(that).data('double'), 10);
if (dblclick > 0) {
$(that).data('double', dblclick-1);
} else {
singleClick.call(that, event);
}
}, 300);
}).dblclick(function(event) {
$(this).data('double', 2);
doubleClick.call(this, event);
});
// I really don't know why, but when we don't handle the mousedown event here
// double-clicking the page does select some object (the first child of body
// on Firefox and the nearest element on Chrome)
$('html').bind('mousedown', function(e) {
return false;
});
});
})(jQuery);
/* vim: set foldmethod=indent: */
aawiki/static/aawiki/js/jquery.wrapContent.html 0 → 100644
View file @ ef0fec26
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"/>
<title>active archives</title>
</head>
<style type="text/css" media="screen">
.wrapper {
border: 1px solid red;
padding: 1em;
}
</style>
<body>
<section class="section1">
<h1>1</h1>
<p>Section 1</p>
<section class="section2">
<h2>1.1</h2>
<p>Subsection 1.1</p>
</section>
<section class="section2">
<h2>1.2</h2>
<p>Subsection 1.2</p>
<section class="section3">
<h3>1.2.1</h3>
<p>Hey 1.2.1 Special section</p>
</section>
<section class="section3">