Saving Notes: Simple Hack

[JT]

Hey,

I had a need to save the note content and position between page
reloads. Here is a simple hack that works like a champ. Enjoy!

index.php

<div id="notes" style="width:1450px;height:800px;">
</div>
<script type="text/javascript">
// wait for the DOM to be loaded
$(document).ready(function() {

//Read in previous state
<?php
@readfile("./notes_db.txt");
?>

//Load notes & create sticky overlay
$('#notes').stickyNotes(options);

//Save Functionality
$("body").append('<div id="save"><b>[SAVE]</b></div>');
$("#save").click(function() {
var notes = '';
//Loop through all notes
$(".jSticky-medium").each(function(index) {
//Grab Position
var position = $(this).position();
notes += position.left + ',' + position.top + ',' +
$(this).height() + ',' + $(this).width() + ',' + $(this).text() + '|';
});

//Save them off
$.ajax({
type: 'POST',
url: './save_notes.php',
data: "notes="+notes,
success: function() {alert("Saved!");}
});

});

});

</script>
</div>



save_notes.php

<?php

//Grab the notes

//Init
$id = 1;
$options = 'var options = {notes:[';
//Get Data in correct format
$note_str = $_POST['notes'];

$notes = explode("|",$note_str);
array_pop($notes); //Delete last item off array

foreach($notes as $note) {
$note_details = explode(",",$note);
//[0] = left, [1] = top, [2] = height, [3] = width, [4] = text
$options .= '{"id":'.$id.',';
$id = $id + 1;
$options .= '"text":"'.$note_details[4].'",';
$options .= '"pos_x":'.$note_details[0].',';
$options .= '"pos_y":'.$note_details[1].',';
$options .= '"width":'.$note_details[3].',';
$options .= '"height":'.$note_details[2].',';
$options .= '},';
}

$options .= ']};';


$filename = "./notes_db.txt"; #Must CHMOD to 666
$fp = fopen ($filename, "w"); # w = write to the file only, create
file if it does not exist, discard existing contents
if ($fp) {
fwrite ($fp, $options);
fclose ($fp);
echo ("File written");
}
else {
echo ("File was not written");
}

?>