From 58368f2eaf9aa4f0f9fcd3444dce6e7e1251952d Mon Sep 17 00:00:00 2001
From: Daniel Morrisey <danny@Daniels-Mac-mini.local>
Date: Tue, 14 Jul 2026 22:50:17 -0400
Subject: [PATCH] changes

---
 buffit/index.html | 73 ++++++++++++++++++++++++++++++++++++++++++-----
 1 file changed, 66 insertions(+), 7 deletions(-)

diff --git a/buffit/index.html b/buffit/index.html
index 2670c5a..7079fc1 100644
--- a/buffit/index.html
+++ b/buffit/index.html
@@ -504,7 +504,7 @@
   <!-- COMPOSER SCREEN -->
   <div class="composer" id="composerScreen">
     <div class="account-bar">
-      <span><span class="dot"></span><span id="accountLabel">Connected</span></span>
+      <span><span id="accountLabel">Connected</span></span>
       <button id="disconnectBtn">Disconnect</button>
     </div>
 
@@ -514,6 +514,7 @@
       <div class="composer-footer">
         <div class="footer-left">
           <button class="media-btn" id="mediaBtn" type="button"><i class="fa-solid fa-image"></i></button>
+          <button class="media-btn" id="emojiBtn" type="button"><i class="fa-solid fa-face-smile"></i></button>
           <span class="charcount" id="charCount">0</span>
         </div>
         <button class="btn-primary" id="sendBtn" style="width:auto;margin:0;padding:10px 22px;">Post now</button>
@@ -556,12 +557,27 @@
   const channelList = $('channelList');
   const accountLabel = $('accountLabel');
   const mediaBtn = $('mediaBtn');
+  const emojiBtn = $('emojiBtn');
   const mediaInput = $('mediaInput');
   const mediaPreview = $('mediaPreview');
 
   const CHAR_LIMIT = 2000;
   const MAX_MEDIA = 4;
 
+  // Service-based character limits
+  const SERVICE_LIMITS = {
+    'twitter': 280,
+    'linkedin': 3000,
+    'facebook': 63206,
+    'instagram': 2200,
+    'pinterest': 500,
+    'tiktok': 2200,
+    'threads': 500,
+    'bluesky': 300,
+  };
+
+  let allChannels = [];
+
   function setStatus(el, message, type) {
     el.textContent = message;
     el.className = 'status' + (message ? ' show' : '') + (type ? ' ' + type : '');
@@ -809,7 +825,23 @@
     }
   }
 
+  function getCharLimit(service) {
+    return SERVICE_LIMITS[service?.toLowerCase()] || CHAR_LIMIT;
+  }
+
+  function getMinCharLimit() {
+    if (selectedChannelIds.size === 0) return CHAR_LIMIT;
+    let minLimit = Infinity;
+    allChannels.forEach((ch) => {
+      if (selectedChannelIds.has(ch.id)) {
+        minLimit = Math.min(minLimit, getCharLimit(ch.service));
+      }
+    });
+    return minLimit === Infinity ? CHAR_LIMIT : minLimit;
+  }
+
   function renderChannels(channels) {
+    allChannels = channels;
     channelList.innerHTML = '';
     if (!channels.length) {
       channelList.innerHTML = '<div style="color:var(--text-faint);font-size:13px;">No connected channels on this Buffer account.</div>';
@@ -829,6 +861,7 @@
         item.classList.toggle('checked', checkbox.checked);
         if (checkbox.checked) selectedChannelIds.add(ch.id);
         else selectedChannelIds.delete(ch.id);
+        updateCharCount();
         updateSendState();
       });
       channelList.appendChild(item);
@@ -900,6 +933,26 @@
 
   mediaBtn.addEventListener('click', () => mediaInput.click());
 
+  // ---------- emoji picker ----------
+  emojiBtn.addEventListener('click', () => {
+    const input = document.createElement('input');
+    input.type = 'text';
+    if (input.showPicker) {
+      input.addEventListener('input', (e) => {
+        postText.value += e.target.value;
+        updateCharCount();
+        updateSendState();
+      }, { once: true });
+      input.showPicker();
+    } else {
+      // Fallback: insert a smile emoji if showPicker is not supported
+      postText.value += '😊';
+      updateCharCount();
+      updateSendState();
+      postText.focus();
+    }
+  });
+
   mediaInput.addEventListener('change', () => {
     const files = Array.from(mediaInput.files || []);
     mediaInput.value = '';
@@ -941,10 +994,15 @@
   });
 
   // ---------- character count ----------
-  postText.addEventListener('input', () => {
+  function updateCharCount() {
     const len = postText.value.length;
-    charCount.textContent = len;
-    charCount.className = 'charcount' + (len > CHAR_LIMIT ? ' over' : len > CHAR_LIMIT * 0.9 ? ' warn' : '');
+    const limit = getMinCharLimit();
+    charCount.textContent = len + ' / ' + limit;
+    charCount.className = 'charcount' + (len > limit ? ' over' : len > limit * 0.9 ? ' warn' : '');
+  }
+
+  postText.addEventListener('input', () => {
+    updateCharCount();
     updateSendState();
   });
 
@@ -952,7 +1010,8 @@
     const len = postText.value.trim().length;
     const hasContent = len > 0 || attachedMedia.length > 0;
     const mediaBusy = attachedMedia.some((m) => m.uploading);
-    sendBtn.disabled = !hasContent || len > CHAR_LIMIT || selectedChannelIds.size === 0 || mediaBusy;
+    const limit = getMinCharLimit();
+    sendBtn.disabled = !hasContent || len > limit || selectedChannelIds.size === 0 || mediaBusy;
     mediaBtn.disabled = attachedMedia.length >= MAX_MEDIA;
   }
 
@@ -1013,8 +1072,7 @@
     if (failures.length === 0) {
       setStatus(composerStatus, 'Posted to ' + ids.length + ' channel' + (ids.length === 1 ? '' : 's') + '.', 'success');
       postText.value = '';
-      charCount.textContent = '0';
-      charCount.className = 'charcount';
+      updateCharCount();
       clearMedia();
     } else if (failures.length < ids.length) {
       const uniqueErrors = [...new Set(errorMessages.map(msg => msg.replace(/^Invalid post:\s*/, '')))];
@@ -1031,6 +1089,7 @@
     clearTokens();
     selectedChannelIds = new Set();
     postText.value = '';
+    updateCharCount();
     clearMedia();
     showConnect();
   });
-- 
2.51.2