Share
Hva du skal skapeMacen har mange applikasjoner som er minimalistiske: programmer som angir minimum antall mulige alternativer samtidig som funksjonaliteten fortsatt er beholdt. Det er mange minimalistiske tekstredaktører. FoldingText skiller seg ut som annerledes.
I denne opplæringen vil jeg introdusere deg til FoldingText redaktør og vise deg hvordan du skal utvide den med:
Ikke bare er det FoldingText minimalistisk i design, men også i filformat: det bruker bare vanlige tekstfiler. All formatering er ferdig med Markdown med en vri: Du kan markere hvilket som helst område som har spesiell formatering og funksjonalitet ved å legge til en utvidelse til slutten av en overskriftslinje.
FoldingText Vindu og menyer Når du starter FoldingText, Du blir presentert med et vanlig vindu. Dette rene, minimal grafiske grensesnittet bidrar til å fokusere på skrivingen og ikke på programmet.
Noen Markdown Når du skriver inn Markdown formateringskommandoer, teksten er uthevet og ekstra ting, for eksempel adresser i en kobling, er skjult. I eksemplet ovenfor kan du se Markdown for et anker mens markøren fortsatt er på den.
Skjul ankermerket Når du flytter til en ny linje, eller legger til et annet tegn, FoldingText skjuler adressedetaljer slik at du bare ser tittelen.
Folding Text Rediger nå Markdown Tekst for å være en topptekst og klikk på # symbol ved siden av Introduksjon. Dette folder raskt teksten i den delen opp til neste overskrift. Det brettede tekstsymbolet vises øverst i venstre hjørne. Dessuten legger den til a ... (en ellipsis) til enden av den brettede delen. Klikk på enten det trekantede symbolet øverst til venstre eller på ... på slutten av den brettede delen vil utfolde den teksten.
Todo og Timer Extensions Den virkelige innovasjonen som finnes i FoldingText er utvidelsene. FoldingText leveres med to utvidelser forhåndsbygd i: å gjøre, og tidsur.
De å gjøre utvidelse gir deg en liste over flere nivåer med avmerkingsbokser.
De tidsur forlengelse gir deg timere for å varsle deg. Timers fungerer som nedtelling timere. Hvis du lager en liste med tider på linjene, vil den nedtelling den øverste tiden, meld deg og starte neste gang. Du kan opprette så mange utvidelsesområder i ett dokument som du trenger.
Som du kan se i todo-listen eksempel, kan du merke en hvilken som helst linje inn FoldingText. Syntaxen for taggen er @ og litt tekst. FoldingText bruker noen koder for spesiell formatering (dvs.: cross-out på @done stikkord).
kommandoer FoldingText har en kommandopalett som ligner på det som ble populært med Sublim tekst. Når du trykker på Kommando-sitat, En liste over alle tilgjengelige kommandoer vises. Det har ikke så mange kommandoer innebygd, så jeg viser deg hvordan du legger til noen.
For å begynne a plugg inn, du starter med Plug-In Manager.
Åpner Plug-In Manager Fra FoldingText Hovedmeny, velg Plug-In Manager.
Plug-In Manager Lefhand-panelet viser en liste over hver plugin-modul som er installert. Ved å klikke på en, vises beskrivelsen på høyre side. Alle disse utvidelsene kan lastes ned fra FoldingTextnettside ved å klikke på Finn Plug-Ins knapp.
For å lage en plugin, gå til plugin-katalogen ved å velge Åpne Plugins-mappe knappen nederst til høyre.
Plugins-mappe Dette åpnes Finder i katalogen som inneholder alle plugin-modulene. Opprett en katalog som heter MySnippets.ftplugin. I den katalogen lager du filene main.js og package.json. Dette er de minste filene som trengs for en plugin.
FoldingText utvidelser er kodet med Javascript. De package.json filen gir FoldingText informasjon som skal vises i Plug-In Manager.
I package.json fil, legg følgende:
"navn": "MySnippets", "versjon": "1.0.0", "beskrivelse": "Legger til mine egne utdrag, kommandoer og nøkkelbindinger til Folding Text.", "Hjemmeside": "", "Motorer" : "foldingtext": "> 2.0.0", "oppgavepapir": "> 3.0.0"
Dette forteller FoldingText om plugin-modulen Navn, versjon, beskrivelse, hjemmeside av forfatteren, og hvilke versjoner av FoldingText eller TaskPaper å bruke. Bare FoldingText 2.0.0 eller TaskPaper 3.0.0 og større støtter plugin-moduler.
For å legge til utklipp til FoldingText, legg til følgende linjer i main.js fil:
Accentsconagua
// // MySnippets og ulike utvidelser til FoldingText. // definere (funksjon (kreve, eksport, modul) // // Hent en referanse til Extensions. // Var Extensions = krever ('ft / core / extensions'). Extensions; // // Bruk addSnippet til å lage min forskjellige utdrag. // Extensions.addSnippet ('; tut': '## Due: \ nFoldable \ n \ n ## Teaser \ n \ n \ n \ n ## Opplæringsnavn \ n \ n \ n \ n # ## Konklusjon \ n \ n \ n \ n ## Ting å gjøre.todo \ n- Skriv artikkelen \ n- Bevis lese artiklen \ n- Send artikkelen \ n ','; kode ': funksjon returnere '## Kode \ n \ n # # Sluttkode \ n \ n';);); Alle utvidelsesfiler begynner med definere() funksjon. Den funksjonen har en funksjon som når den blir kalt, vil akseptere tre objekter: krever, eksport, og modul. De krever objekt lar deg skaffe et hvilket som helst bibliotek som utvidelser bibliotek for å legge til ting i FoldingText.
For å lage utklipp, bruk addSnippet funksjon av utvidelser. Det forventer en json nøkkelverdi-matrise. Nøkkelen vil være utvideteksten og verdien evalueres til tekst for å erstatte nøkkelen. Utvidelsessiden kan være tekst eller en funksjon.
Jeg definerte to utdrag her: ; tut og ;kode. Når du skriver inn tekst som følger med en fane, blir teksten utvidet tilsvarende. De ; tut koden gir meg et bare minimum opplæringsoppsett. De ;kode koden gir meg en kollapsbar kodeblokk slik at jeg kan kaste bort koden før jeg får et ord i min veiledning.
For å legge til hurtigtaster, bruker du en krok til å starte redigeringsmaskinen. Like etter koden for utdrag, legg til denne koden:
// // Opprett en funksjon for når redigereren er lastet for å laste inn spesiell feilsøkingsinformasjon // og tastaturmappings. // Extensions.addInit (funksjon (editor) // // Legg til egendefinerte KeyMappings // editor.addKeyMap ('Alt-C': 'formatCodeblock';; ExtensionsPriorityLast); De Extensions.addInit () funksjonen legger til funksjonen til initialiseringsprosessen for redaktøren. De redaktør objektet vil bli overført til funksjonen. Bruker editor.addKeyMap () funksjon, en tastaturgenvei er enkelt lagt til redaktøren.
Denne funksjonen forventer en json nøkkelverdi-liste med nøkkelen som tastaturgenveien, og verdien er navnet på funksjonen som skal utføres. Siden jeg ofte bruker kodeblokker, laget jeg en snarvei for den.
Hvis du er god til Javascript programmering, å lage dine egne kommandoer er enkle. Enhver kommando som er laget vil være tilgjengelig i kommandopaletten. Jeg jobber med mange todo lister og flytter ofte frem og tilbake. Du kan automatisere det med følgende kode:
// // Legg til kommandoer for FoldingText. // Extensions.addCommand (name: 'moveTDNext', beskrivelse: 'Flytt gjeldende Todo node til neste Todo list.', PerformCommand: funksjon (editor) var cnode = editor.selectedRange (). StartNode, pnode = cnode .previousBranch (), snode; // // Gå til toppteksten for den aktuelle todo-listen. // mens (pnode.type ()! = 'overskrift') pnode = pnode.previousBranch (); // / / Gå til neste avdeling som er en todo-liste og gjør // at du er øverst. // snode = pnode.nextBranch (); mens (snode.type ()! = "Heading") snode = snode. nextBranch (); // // Legg det til dette punktet. // snode.appendChild (cnode);); Extensions.addCommand (name: 'moveTDPrevious', beskrivelse: 'Flytt gjeldende Todo node til forrige Todo liste.', PerformCommand: function (editor) var cnode = editor.selectedRange (). StartNode, pnode = cnode.previousBranch (), snode; // // Gå til toppen av dagens todo-liste. // mens (pnode.type ()! = 'overskrift') pnode = pnode.previousBranch (); // // Gå til den forrige listen og sørg for at den er toppen. // snode = pnode.previousBranch (); mens (snode.type ()! = "heading") snode = snode.previousBranch (); // // legg til den grenen. // snode.appendChild (cnode););
De Extensions.addCommand () funksjonen brukes til å opprette ny kommando. I dette kodeeksemplet er kommandoene: moveTDNext, og moveTDPrevious. moveTDNext Flytter gjeldende todo-elementet som markøren er på, til neste todo-liste. moveTDPrevious gjør akkurat det motsatte.
De Extensions.addCommand () tar en json liste med tre elementer: Navn, beskrivelse, og performCommand. De Navn elementet er en streng som gir et navn til kommandoen uten mellomrom. De beskrivelse er en streng som beskriver hva kommandoen gjør. Denne beskrivelsen vises i kommandopaletten. De performCommand er en funksjon som vil akseptere en redaktør forekomst og returnere ingenting.
Hjelp-menyen I disse funksjonene bruker jeg redigerings-API'en til å flytte til overskriften til den aktuelle todo-listen, flytter til neste eller forrige liste, og legger elementet til listen. API-en er for stor til å beskrive for denne opplæringen. Alle API-dokumentene er tilgjengelige fra Hjelp> Software Development Kit Meny.
Programvareutviklingssett De dokumentasjon lenke vil åpne HTML-dokumentasjonen i standard nettleser. De Kjør Editor lenken vil starte FoldingText forekomst med koden debugger aktivert. De Kjør spesifikasjoner lenken vil kjøre alle spesifikasjoner på FoldingText og hver av dens utvidelser.
I FoldingText terminologi, a manus bruker Apple å injisere a Javascript fungere inn i FoldingText å utføre en handling. FoldingText legger til to søkeord i det Apple ordbok: evaluere og debug. Både evaluere og debug ta en Javascript og parametere for input, men evaluere kjører det og returnerer resultatet mens debug lanserer skriptet i debuger-vinduet.
Et godt eksempel ville være å få en liste over koder fra det øverste vinduet. Åpne AppleScript Editor med denne koden:
fortell søknaden "FoldingText" sett lstDocs til dokumenter hvis lstDocs ≠ så fortell element 1 av lstDocs returnere (evalueringsskript "-funksjon (redaktør) return editor.tree (). tags (true) .sort ();") fortell slutt hvis slutt tell
Dette forteller det første FoldingText dokument for å evaluere a Javascript funksjon som aksepterer en redigeringseksempel. Funksjonen får taggene fra FoldingText redaktør objekt og returnerer dem sortert.
Skript for å få tagger Når dette skriptet blir utført, er resultatet taggene i gjeldende dokument. Her har det nåværende dokumentet kodene ferdig og neste. Jeg bruker dette skriptet sammen med andre i en Alfred-arbeidsflyt. Du kan få arbeidsflyten fra nedlastingen for denne artikkelen.
En forlengelse for FoldingText legger til ny funksjonalitet for redaktøren. En matteblokk som gjør det mulig å lage noen beregninger, ville være veldig hyggelig å ha.
Opprett en ny utvidelse som heter imath.ftplugin. I filen package.json legger du til følgende:
"navn": "iMath-modus", "versjon": "1.0.0", "beskrivelse": "Legger til" imatemodus "," hjemmeside ":" https://customct.com "," motorer ": "foldingtext": "> 2.0.0"
Dette gir all nødvendig informasjon for å beskrive utvidelsen.
For å gjøre den faktiske matte er Math.js-rammen stor. Last ned det biblioteket og legg det i katalogen med main.js fil.
I main.js fil, legg til denne koden:
// // Fil: main.js // // Beskrivelse: Denne filen definerer matematikkmodus for FoldingText. Det // behandler matematikk linjene ved hjelp av mathjs biblioteket. // definere (funksjon (krever, eksport, modul) 'bruk streng'; // // Last inn bibliotekene jeg trenger å bruke. // Var Extensions = krever ('ft / core / extensions'). = krever ("./ mathjs.js"); // // Legg til 'matematikk'-forlengelsen til systemet. // Extensions.addMode (name:' imath ');); Denne utvidelsen starter akkurat som utvidelsen. Etter å ha fått en referanse til utvidelser bibliotek, krever brukes til å laste inn math.js bibliotek fra utvidelsesmappen. For å laste inn lokale biblioteker, krever bruker en relativ bane til hele bibliotekets filnavn.
neste, Extensions.addMode () funksjonen brukes til å legge til en ny modus med navnet imath. Denne funksjonen aksepterer en json-liste med nøkkelen Navn sett til navnet på den nye utvidelsen: imath. Dette gjør det mulig å definere en blokk med tekst som inneholder matte for imath utvidelse til å evaluere.
Noen hjelperfunksjoner er nødvendig. Legg til denne koden etter Extensions.addMode () funksjon:
// // Funksjon: InMathArea // // Beskrivelse: Denne funksjonen bestemmer om den nåværende noden er i // et matteområde og ikke er tomt. // funksjon inMathArea (node) if ((node.modeContext () === 'imath') && (node.text (). trim ()! = "")) return (true); ellers return (false); ; // // Funksjon: Beregn // // Beskrivelse: Denne funksjonen får nåværende node og dagens nodes // strenginnhold. Den returnerer resultatet av beregningen. // funksjon Beregn (str) var result = 0, scope = ; prøv // // Bruk Mathjs-biblioteket til å evaluere ligningen. // var linjer = str.substr (0, str.length - 2) .split ("\ n"); lines.forEach (funksjon (linje) var node, kode; kode = mathjs.compile (linje); result = code.eval (scope);); catch (e) // // Mathjs hadde et problem med uttrykkene. Returner en? // resultat = "?" + "-" + e.toString (); retur (resultat); ; Funksjonen inMathArea () tar en knutepunkt og bestemmer om noden er i et matte tekstområde ved å ringe node.modeContext (). Siden behandling av tomme linjer ikke resulterer i noe, kontrollerer den også for den tilstanden.
De Regne ut() funksjonen vil ringe til Math.js bibliotek for å vurdere strengen gitt. Hvis biblioteket kaster unntak, returnerer det et spørsmålstegn. Strengen som skal evalueres, vil være hele linjen bortsett fra de to siste tegnene.
Den siste tingen å gjøre er å koble til rutinen som kalles når brukeren endrer teksten. Legg til disse kodelinjene etter Regne ut() funksjon:?
// // Function: ProcessPreviousNodes // // Beskrivelse: Denne funksjonen skanner for tidligere imath linjer som // ikke er skjult. Skjulte linjer ignoreres, men // synlige linjer behandles for riktig matte. // funksjon ProcessPreviousNodes (node) var pnode = node, text = "", result = ""; mens (pnode && (! pnode.mode ()) && (pnode.modeContext () === 'imath')) // // Ikke en overskrift, se om den har en evalueringskommando. // text = pnode.text (); hvis (text.search ("=>") < 0) // // No evaluation, add it to the rest. // result = text + "\n" + result; pnode = pnode.previousBranch(); return (result); // // Function: ProcessMathNode // // Description: This function is used to process a node in the math // context. It expects the node to be passed to it. // function ProcessMathNode(node) // // Calculate if needed. Get the text of the line. // var result = node.text(); // // See if it ends in "=>"Hvis ja, behandle linjen. // hvis (result.substr (-2) ==" => ") // // Se om noen av de forrige linjene hadde // variable deklarasjoner. // result = ProcessPreviousNodes (node) + "\ n" + resultat; // // Se om andre områder har variable definisjoner. // var pnode = node.parent.previousBranch (); mens (pnode) hvis (pnode.modeContext () == = 'imath') if (! editor.nodeIsHiddenInFold (pnode) &&! editor.isCollapsed (pnode)) result = ProcessPreviousNodes (pnode.lastChild) + "\ n" + resultat; pnode = pnode.previousBranch ; // // Beregn resultatet. Hvis Beregner returnerer en matrise, var det også // variabler funnet i. Bare få det endelige resultatet. // var cresult = Beregn (resultat); hvis (isArray (cresult)) // // Vi får mer enn på svar tilbake. Derfor, // bare få det siste resultatet. // cresult = cresult [cresult.length - 1]; // // Sett resultatet sammen med den opprinnelige linjen. // result = node.text () + "" + cresult; // // Oppdater linjen. // node.setText (result); // // Legg til et TreeChan Ged hendelsen handler å finne ut når du skal kjøre // en beregning. // Extensions.addTreeChanged (funksjon (editor, e) var deltas = e.deltas; for (var i = 0; i < deltas.length; i++) var updatedNode = deltas[i].updatedNode, insertedNodes = deltas[i].insertedNodes, length = 0; // // Check all the inserted nodes. // length = insertedNodes.length; for (var j = 0; j < length; j++) var each = insertedNodes[j]; if (inMathArea(each)) // // It's a math node. Process it. // ProcessMathNode(each); // // Check the updated Nodes. // if (updatedNode) // // It is an updated Node. Make sure it is in the math area. // if (inMathArea(updatedNode)) // // It's a math node. Process it. // ProcessMathNode(updatedNode); ); De Extensions.addTreeChanged () funksjonen brukes til å koble seg til tekstendringsrutinene. FoldingText holder en trestruktur av hver tekstlinje i dokumentet. Når trestrukturen endres, blir alle registrerte funksjoner kalt med redaktørinstansen og en struktur av deltas.
Funksjonen løper gjennom hver oppdatering delta og tillegg for å avgjøre om det er i imath område som bruker inMathArea () funksjon. Hvis det er og de to siste tegnene i linjen er =>, og så ProcessMathNode () funksjon kalles. De ProcessMathNode () funksjonen kaller et par hjelpefunksjoner for å klatre opp på dokumentet for å få noe relevant imath seksjoner.
Hvis en seksjon er skjult, ignoreres den. På den måten kan ulike scenarier brukes og evalueres. En gang alle relevante imath seksjoner behandles, hele er gitt til Regne ut() å evaluere resultatene. Resultatene legges til slutten av linjen med riktig avstand og sendes tilbake i treet. Matematikkutvidelsen beregnes bare etter at brukeren skriver inn a =>.
Testing av iMath ExtensionNår du har lagret filen, må du laste på nytt FoldingText. Prøv linjene over og se resultatene. Bare husk: å re-evaluere et uttrykk du må slette de forrige resultatene. Det nye resultatet beregnes og returneres til dokumentet.
FoldingText gjør bruk av Less.js å stile det brukergrensesnittet. FoldingText er egentlig en nettleser uten alt brukergrensesnittet for nettleseren.
Det er to måter å endre hvordan FoldingText ser: legg til Less.js uttalelser til user.less fil som er en katalog opp fra Plugins-katalogen, eller legg den til en style.less fil i hvilken som helst plugin-mappe.
Åpne for eksempel Finder i Plugins-mappen og gå opp en katalog. Der åpner du user.less fil. Du vil se:
// Dette er din user.less. Bruk den til å overstyre standard styling. Når denne // filen er først opprettet, blir alle linjer kommentert (start med //), og så har // ingen effekt i editorens stil. // For å endre skrifttypen, kommenterer ikke følgende linje: // @ fontFamily: Menlo; // For å endre skriftstørrelsen, kommenterer ikke følgende linje: // @ fontSize: 10pt; // For å endre basen "blekk" farge (brukt til tekst) ikke kommenterer følgende // linje: // @ inkColor: svart; // Hvis du vil endre grunnlaget "papir" farge (bak teksten) ikke kommenterer følgende // linje: // @ paperColor: hvit; // Farge brukes til å indikere noe. Slik som når musen er over en lenke. // @ indikertColor: blå;
Dette er noen av standardinnstillingene som du kan endre. Jeg foretrekker større tekst, så fjern kommentarindikatoren for @skriftstørrelse variabel og sett den til 12 pkt. Når du lagrer og oppdaterer FoldingText, all tekst vil være basert på 12 pkt størrelse.
Hvis det er noe du vil endre som ikke er oppført i filen, åpner du debugger å bla gjennom DOM. Finn det du vil ha, få det ID, og endre det i Less.js fil.
Mens du lager alle disse utvidelsene, må du feilsøke koden din eller bla gjennom DOM for å finne det du trenger å endre. FoldingText gjør det veldig enkelt.
Debuggeren Når du velger Kjør Editor lenke på Programvareutviklingssett, du får det FoldingText Redaktør med kontroller for feilsøking. Velger Inspektør i verktøylinjen viser standarden Safari utviklerverktøy. Dette gir deg alle verktøyene du trenger for å feilsøke noe i FoldingText. Du kan sjekke Apple Safari Utviklerveiledning for informasjon om bruk av utviklerverktøyene.
I denne opplæringen har jeg vist deg hvordan du lager snippets, hurtigtaster, kommandoer, skript, utvidelser og temaer for FoldingText. Siden det er alt basert på nettleserteknologi, er læringskurven enkel. Med all rikdom av Javascript Biblioteker tilgjengelig, det er nesten ingen grense for hva du kan gjøre med FoldingText.
